<template>
	<section id="apply">
		<van-nav-bar title="申请推广资格" left-arrow @click-left="jumpHome"/>
		<p class="centers"> 规则会随着系统迭代更新，为了避免争议请
			<router-link to="/rules">先查看规则</router-link>!
		</p>
		<van-cell-group>
			<van-field
				v-model="name"
				required
				clearable
				label="姓名"
				icon="question-o"
				placeholder="请输入姓名"
			/>
			<van-field
				v-model="sex"
				required
				clearable
				label="性别"
				placeholder="请输入姓别"
			/>
			<van-field
				v-model="age"
				type="number"
				required
				clearable
				label="年龄"
				placeholder="请输入年龄"
			/>
			<van-field
				required
				type="number"
				clearable
				v-model="phone"
				label="手机"
				placeholder="请输入手机号"
			/>
			<van-field
				required
				clearable
				v-model="password"
				label="密码"
				placeholder="请输入密码"
			/>
			 <van-field
				required
				clearable
				v-model="address"
				label="联系地址"
				type="textarea"
				placeholder="请输入所在省市"
				rows="1"
				autosize
			/>

			<van-field
				required
				clearable
				v-model="byAlias"
				label="邀请码"
				type="textarea"
				placeholder="请输入邀请人推广码"
				rows="1"
				autosize
			/>

			<van-button plain type="primary" size="large" @click="applyFunc()">提交申请</van-button>
		</van-cell-group>
		
	</section>
</template>

<script>
	export default {
		data() {
			return {
				name: "",
				sex: "",
				age: "",
				phone: "",
				address: "",
				password: "",
				remarks: "",
				byAlias: "A001"
			};
		},
		components: {

		},
		methods: {
			onClickLeft(){
				this.$router.go(-1)
			},
			// 返回首页
			jumpHome() {
				this.$router.push({path: '/'})
			},
			applyFunc() {
				let _this = this;
				if (_this.name.length < 2 || _this.name.length > 4) {
					_this.$toast('请输入正确的姓名！');
					return false;
				}
				if (_this.sex != '男' && _this.sex != '女') {
					_this.$toast('请输入性别男女！');
					return false;
				}
				if (!_this.age || _this.age < 18 || _this.age > 80) {
					_this.$toast('请输入正确的年龄！');
					return false;
				}
				if (_this.phone.length != '11') {
					_this.$toast('请输入正确的手机号！');
					return false;
				}
				if (!_this.password) {
					_this.$toast('请输入密码！');
					return false;
				}
				if (!_this.address) {
					_this.$toast('请输入省市！');
					return false;
				}
				if (_this.byAlias.length != 4) {
					_this.$toast('请输入正确的邀请码！');
					return false;
				}

				// 加载遮罩
				let loadToast = this.$toast.loading({
					mask: true,
					message: '加载中...',
					duration: '30000'
				});
				let sex = (this.sex == '男')?'1':'0'
				this.service.apply({
					name: this.name,
					sex: sex,
					age: this.age,
					address: this.address,
					phone: this.phone,
					password: this.password,
					myId: '',
					aliasId: '',
					remarks: '',
					byAlias: this.byAlias
				}).then(res => {
					loadToast.clear();
					if (res.data.result.ok) {
						this.$dialog.alert({
							message: '提交成功，请添加管理员微信：zhang767653317！'
						}).then(() => {
							_this.jumpHome();
						});
					}else{
						this.$dialog.alert({
							message: res.data.message
						});
					}
				})
			},
		},
		mounted() {
			let p = this.$route.query.p;
			if (p) {
				this.byAlias = p;
			}
		},
		computed: {
		}
	};
</script>
<style scoped lang="scss">
	#apply{
		background:#fff;
		height: auto;
		min-height: 100%;
		.centers{
			line-height: 60px;
			font-size: 24px;
			text-align: center;
			background: #eaeaea;
		}
		.rulesBtn{
			text-align: center;
			margin-top:40px;
			font-size: 14px;
		}
		.rulesBtn a{
			color:#000;
		}
		.rulesBtn a span{
			color:#ff0000;
		}
		.van-cell-group {
			padding: 50px 30px;
			.van-cell--required{
				border-bottom: 1px solid #eaeaea;
			}
			.van-button{
				margin-top:60px;
			}
		}
		
	}
	
</style>
